<template>
    <div  style="background: #fff;min-height: calc(100vh)">
        <van-nav-bar left-arrow @click-left="back()"/>
        <van-form style="margin-top: 15px">
            <van-field v-model="form.name" label="分组名称" placeholder="请填写分组名称" />
            <div style="margin: 26px 10px;">
                <van-button round block type="info" @click="update()">提 交</van-button>
                <van-button v-if="form.id" round block style="margin-top: 15px" @click="destroy()" type="default">删 除</van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
import {Group,GroupUpdate,GroupDestroy} from '@/utils/request';
import {Dialog} from "vant";
export default {
    data() {
        return {
            form: {
                id: 0,
                name: ''
            },
        }
    },
    activated() {
        this.$store.dispatch('setActive', 4);
       if(this.$route.query.id && this.$route.query.name){
           this.form.id = this.$route.query.id;
           this.form.name = this.$route.query.name;
       }else{
           this.form.id = 0;
           this.form.name = '';
       }
    },
    methods: {
        update(){
            if(!this.form.name){
                Dialog.alert({
                    message: '请填写分组名称',
                    confirmButtonText: '知道了'
                });
                return false;
            }
            GroupUpdate(this.form).then((res)=>{
                if(res.code == 0){
                    this.back();
                }
            });
        },
        destroy(){
            Dialog.confirm({
                message: '确定要删除该分组吗？',
                beforeClose: (action, done)=>{
                    if (action === 'confirm') {
                        GroupDestroy({id: this.$route.query.id}).then((res) => {
                            if (res.code == 0) {
                                done();
                                this.back();
                            }
                        });
                    } else {
                        done();
                    }
                },
            }).catch(() => {});
        },
        back() {
            this.$router.go(-1);
        },
    }
}
</script>

<style scoped>


</style>
